<script setup>
import View3jsAnimation from '@renderer/components/CompoThreejsAinm.vue'
// import CompoThreejsAinmFBX from '@renderer/components/CompoThreejsAinmFBX.vue'
import { ref } from 'vue'

const modelanim = ref({
  id: 'model_animated',
  name: '印模 带动画',
  gltfUrl: 'threed_models/yinmo_animated.glb',
  // gltfUrl: 'threed_models/yinmu.fbx',
  bgColor: '#56cd78',
  cameraZ: 1,
  maxDistance: 10,
  minDistance: 0.1
})
</script>

<template>
  <div class="model_view">
    <View3jsAnimation
      :key="modelanim.id"
      :gltf-url="modelanim.gltfUrl"
      :scene-background="modelanim.bgColor"
      :camera-z="modelanim.cameraZ"
      :max-distance="modelanim.maxDistance"
      :min-distance="modelanim.minDistance"
      :product-name="modelanim.name"
    ></View3jsAnimation>
  </div>
</template>

<style lang="scss" scoped>
.model_view {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 0;
}
</style>
